﻿<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="./index.css">
    <title>Document</title>
</head>
<body>
    <div class="calculator">
        <div class="theme-switch">
            <input type="checkbox" name="theme-switch-input" class="theme-switch-input" id="theme-switch-input">
            <label for="theme-switch-input" class="theme-switch-label">
                <!-- 圆圈 -->
                <div class="theme-switch-circle"></div>
            </label>
        </div>
        <div class="screen"></div>
        <div class="calc-buttons">
            <span class="clear">C</span>
            <span class="modulo">%</span>
            <span class="divide">÷</span>
            <span class="multiply">x</span>
            <span class="seven">7</span>
            <span class="eight">8</span>
            <span class="nine">9</span>
            <span class="subtract">-</span>
            <span class="four">4</span>
            <span class="five">5</span>
            <span class="six">6</span>
            <span class="add">+</span>
            <span class="one">1</span>
            <span class="two">2</span>
            <span class="three">3</span>
            <span class="zero">0</span>
            <span class="decimal">.</span>
            <span class="equal">=</span>
        </div>
    </div>

    <script src="./index.js"></script>
</body>
</html>